<!-- 银证转入 -->
<template>
	<view class="ti-container">
		<!-- 空状态 -->
		<view v-if="bank_list.length<=0" class="empty-content">
			<img src="/static/images/wushuju.png" alt="" />
			<text>空空如也</text>
			<button>联系在线客服</button>
		</view>
		<view v-else>
			<view class="head">
				<view class="home-btn222 animate__animated animate__faster tui-skeleton-rect" 
				hover-class="animate__headShake" 
				@click="didididi(item.yzmima,item.id)" 
				v-for="(item,index) in bank_list">
					<image mode="widthFix"  src="../../../static/images/icons/margin_hold_sxzq.png" ></image>
					<text>{{item.tdname}}(银证转入金额{{item.minlow}}-{{item.maxhigh}})</text>
				</view>
			</view>
			<view class="padding pagev">
					<scroll-view class="scroll-view" scroll-y="true" >				
						<u-parse  :content="content"></u-parse>
					</scroll-view>
			</view>
		</view>
		
		<!-- 密钥输入框 -->
		<tui-modal :show="modal9" @cancel="hide9" :custom="true" fadeIn>
			<view style="text-align: center;">
				<view style="padding-bottom: 20rpx;font-size: 34rpx;">密码</view>
				<view style="width: 80%;height: 82rpx;margin: 30rpx auto 50rpx;">
					<input type="password" placeholder="请输入密码" style="border-bottom: 1rpx solid #e6e6e6;height: 80rpx;font-size: 28rpx;text-align: center;" v-if="modal9" v-model="miyao" />
				</view>
				<tui-button height="72rpx" type="theme" :size="28" shape="circle" @click="sure">立即提交</tui-button>
			</view>
		</tui-modal>
		<!-- 单独通道的密码框 -->
		<tui-modal :show="modal10" @cancel="hide10" :custom="true" fadeIn>
			<view style="text-align: center;">
				<view style="padding-bottom: 20rpx;font-size: 34rpx;">密码</view>
				<view style="width: 80%;height: 82rpx;margin: 30rpx auto 50rpx;">
					<input type="password" placeholder="请输入密码" style="border-bottom: 1rpx solid #e6e6e6;height: 80rpx;font-size: 28rpx;text-align: center;" v-if="hide10" v-model="miyao10" />
				</view>
				<tui-button height="72rpx" type="theme" :size="28" shape="circle" @click="sure10">立即提交</tui-button>
			</view>
		</tui-modal>
	</view>
</template>

<script setup>
import {ref, computed, inject} from 'vue';
import {onLoad} from '@dcloudio/uni-app';

const tui = inject('tui');

import uParse from '@/components/uni/uParse/src/wxParse.vue'

import {capitalLog} from '@/api/user.js'

const sysConfig = ref(null);

const list = ref([]);
const modal9 = ref(false);
const miyao = ref('');
const bank_list = ref([]);
const modal10 = ref(false);
const miyao10 = ref('');
const yzmima = ref('');
const bank_id = ref('');
const type = ref('yhxy');
const yhxy = ref('');

const upCallback = () => {
	//联网加载数据  并且加载出卡的信息
	capitalLog({
		size: 1,
		page: 1000,
		type: 0
	}).then(res=>{
		if(res.code == 1){
			console.log(res.data.bank_list);
			bank_list.value = res.data.bank_list
			yhxy.value = res.data.yhxy
			res.data.list.forEach(v=>{
				v.createtime = formatDate('y-m-d h:i:s',v.createtime*1000,2)
			})
			list.value=list.value.concat(res.data.list);
		}
	})
};

onLoad(() => {
	if (uni.getStorageSync('sysConfig')) {
		sysConfig.value = uni.getStorageSync('sysConfig');
	}
	upCallback();
});

const content = computed(() => {
	return yhxy.value;
});

const formatDate = (formatStr, fdate, type = 1, isMs = true) => {
	let date = ""
	if (type === 3) {
		date = _formatTimeStr(fdate, formatStr)
	} else {
		date = _formatDate(formatStr, fdate, type, isMs)
	}
	return date;
};

const _formatDate = (formatStr, fdate, type = 1, isMs) => {
	if (!fdate) return;
	let fTime, fStr = 'ymdhis';
	if (type === 4) {
		fTime = fdate;
	} else {
		fdate = fdate.toString()
		if (~fdate.indexOf('.')) {
			fdate = fdate.substring(0, fdate.indexOf('.'));
		}
		fdate = fdate.replace('T', ' ').replace(/\-/g, '/');
		if (!formatStr)
			formatStr = "y-m-d h:i:s";
		if (fdate) {
			if (type === 2) {
				fdate = isMs ? Number(fdate) : Number(fdate) * 1000
			}
			fTime = new Date(fdate);
		} else {
			fTime = new Date();
		}
	}
	var month = fTime.getMonth() + 1;
	var day = fTime.getDate();
	var hours = fTime.getHours();
	var minu = fTime.getMinutes();
	var second = fTime.getSeconds();
	month = month < 10 ? '0' + month : month;
	day = day < 10 ? '0' + day : day;
	hours = hours < 10 ? ('0' + hours) : hours;
	minu = minu < 10 ? '0' + minu : minu;
	second = second < 10 ? '0' + second : second;
	var formatArr = [
		fTime.getFullYear().toString(),
		month.toString(),
		day.toString(),
		hours.toString(),
		minu.toString(),
		second.toString()
	]
	for (var i = 0; i < formatArr.length; i++) {
		formatStr = formatStr.replace(fStr.charAt(i), formatArr[i]);
	}
	return formatStr;
};

const didididi = (yzmimaValue,bank_idValue) => {
	// 如果有密码 就需要验证密码  如果没有密码 就跳到单独的页面
	yzmima.value = yzmimaValue
	bank_id.value = bank_idValue
	if(yzmimaValue){
		console.log(123)
		modal10.value = true
	}else{
		uni.navigateTo({
			url:"/pages/silverCertificateTransfer/components/banksss?bank_id="+bank_id.value
		})
	}
};

const tiao = () => {
	if(sysConfig.value.kf_url){
		return uni.navigateTo({
			url: '/pages/cms/web'
		})
	}
	return tui.toast('请联系在线客服',3000);
	return tui.toast('请联系在线客服',3000);
	// 判断是否配置了银行卡  如果没有配置 这跳转信息
	// 跳转到银行卡信息
	// uni.navigateTo({
	// 	url:"/pages/ucenter/comp/bankss"
	// })
	// uni.navigateTo({
	// 	url:"/pages/cms/zhuanruins"
	// })
	if(sysConfig.value.yzmy){
		modal9.value = true
	}else{
		uni.navigateTo({
			url:"/pages/ucenter/comp/bankss"
		})
	}
};

const hide10 = () => {
	modal10.value = false
};

const hide9 = () => {
	modal9.value = false
};

const sure = () => {
	if(miyao.value == sysConfig.value.yzmy){
		uni.navigateTo({
			url:"/pages/ucenter/comp/bankss"
		})
		modal9.value = false
	}else{
		tui.toast('密码输入错误,请重新输入',3000);
	}
};

const sure10 = () => {
	if(miyao10.value == yzmima.value){
		uni.navigateTo({
			url:"/pages/ucenter/comp/banksss?bank_id="+this.bank_id
		})
		modal10.value = false
	}else{
		tui.toast('密码输入错误,请重新输入',3000);
	}
};
</script>

<style lang='scss' scoped>
.ti-container {
	position: relative;
	width: 100%;
	height: 100%;
	
	.empty-content {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: absolute;
		top: 20%;
		left: 50%;
		transform: translateX(-50%);
		
		>img {
			margin-bottom: 26rpx;
		}
		
		>text {
			margin-bottom: 184rpx;
			color: #B6B6B6;
			font-size: 28rpx;
			font-weight: 400;
			font-family: PingFangSC, PingFang SC;
		}
		
		>button {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 624rpx;
			height: 98rpx;
			border-radius: 62rpx;
			background: linear-gradient( 178deg, #FF7E3E 0%, #F62645 100%);
			color: #FFFFFF;
			font-size: 32rpx;
			font-weight: 400;
			font-family: PingFangSC, PingFang SC;
		}
	}
}

.boxshow{
		box-shadow: 0 0rpx 16rpx rgba(0, 0, 0, 0.14);
		border-radius: 16rpx;background: #fff;
	}
	.head{
		// padding: 20rpx;
		margin: 20rpx;
		// display: flex;
		flex-wrap: wrap;
	}
	.item{
		padding: 20rpx;
		display: flex;justify-content: space-between;
		margin: 20rpx;
		@extend .boxshow;
	}
	.home-btn222{
		padding: 10rpx 0;
		display: flex;align-items: center;
		justify-content: left;
		border: 1px solid #ddd;border-radius: 8rpx;
		width: 100%;
		margin-top: 20rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		margin-bottom: 20rpx;
		background: transparent;
		&:nth-of-type(3n){
			margin-right: 0;
		}
		image{width: 28rpx;margin-right: 10rpx;max-height: 36rpx;}
	}
	.pagev{
		box-sizing: border-box;
		min-height: 100vh;
	}
	.scroll-view{
		height: 70vh;
	}
</style>